<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			a {
				display: block;
				line-height: 40px;
				color: white;
				margin: 0px;
				margin-left: 40px;
				text-decoration: none;
			}

			.g {
				background-color: #333;
				width: 100%;
				position: fixed;
				top: 0px;
			}

			.g a {
				color: #aaa;
				text-decoration: none;
				display: block;
				float: left;
				margin: 10px;
			}

			a:hover {
				color: white;
			}

			#v {
				text-align: center;
				position: relative;
			}

			#v div {
				width: 400px;
				height: 200px;
				position: absolute;
				top: 40px;
				right: 70px;
				line-height: 100px;
				display: none;
				background: white;
				text-align: center;
				border-radius: 2px;
			}

			#v a:hover+div {
				display: block;
			}

			.box {
				width: 100%;
				height: auto;
				border: 0px solid red;
				overflow: hidden;
				margin: auto;
			}
		</style>
	</head>
	<body>
		<div class="box">
			<nav class="g">
				<a href="#"></a>
				<a href="#">小米商城</a>
				<a href="#">MIUI</a>
				<a href="#">loT</a>
				<a href="#">云服务</a>
				<a href="#">金融</a>
				<a href="#">有品</a>
				<a href="#">小爱开放平台</a>
				<a href="#">企业团购</a>
				<a href="#">资质证照</a>
				<a href="#">协议规则</a>
				<a href="#">下载app</a>
				<a href="#">智能生活</a>
				<a href="#">Select Location</a>
				<a href="#"></a>
				<a href="#"></a>
				<a href="#">登入</a>
				<a href="#">注册</a>
				<a href="#">消息通知</a>
				<div id="v">
					<a href="#" style="background-color: dimgray;">购物车(0)</a>
					<div>您的购物车里没有货物</div>
				</div>
			</nav>
	</body>
</html>
